<!--为隐式调用this.$Modal.confirm提供模板-->
<template>
  <div style="padding: 18px 16px 0;display: flex;flex-direction: row">
    <div class="confirm-left">
      <div class="icon-bg" style="">
        <Icon type="md-alert"  size="27" class="lz-color-primary"/>
      </div>
    </div>
    <div class="confirm-right">
      <div class="lz-title-normal" style="font-weight: bolder">
        {{title}}
      </div>
      <div class="confirm-info" v-html="info">
      </div>
    </div>
  </div>
</template>

<script setup>
import {Icon} from 'view-ui-plus'

const props = defineProps({
  title: {
    type: String,
    default: ''
  },
  info: {
    type: String,
    default: ''
  },
})


</script>

<style scoped>
.icon-bg {
  width: 40px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(0, 174, 173, 0.10);
  border-radius: 50%
}
.confirm-left{

}
.confirm-right{
  flex-grow: 1;
  margin-left: 16px;
}
</style>
